<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>首页布局</title>
</head>
<link href="css/mystyle.css" type="text/css" rel="stylesheet">
<body size-sensor-id="1" style="position: relative;">

<div id="home">
	<div id="header">
		<div id="blogTitle">
			<h1>
				<a id="HeaderTitle" class="HeaderMainTitle" href="#">宋东亭</a>
			</h1>
			<h2>
				思考比黄金更可贵。 记住,风筝逆风而飞。
			</h2>
		</div><!--end: blogTitle 标题和副标题 -->
		<div id="navigator">
			<ul id="navList">
				<li><a id="blog_nav_sitehome" class="menu" href="#">
					客户端</a>
				</li>
				<li>
					<a id="blog_nav_myhome" class="menu" href="#">
						首页</a>
				</li>
				<li>
					<a id="blog_nav_newpost" class="menu" href="#">
						笔记</a>
				</li>
				<li>
					<a id="blog_nav_contact" class="menu" href="#">
						联系</a></li>
				<li>
					<a id="blog_nav_admin" class="menu" href="#">
						管理</a>
				</li>
			</ul>

			<div class="blogStats">
				<span id="stats_post_count">&nbsp; </span>
				<span id="stats_article_count">&nbsp; </span>
				<span id="stats-comment_count"></span>
			</div><!--end: blogStats -->
		</div><!--end: navigator 导航栏 -->
	</div><!--end: header 头部 -->

	<div id="main">
		<div id="mainbar" class="mainbar">
			<div>
				<h1 class="postTitle">客户端软件开发技术作品展示</h1>
				<div class="clear"></div>
				<div id="postBody" class="postBody">
					<ul id="dowebok">
						<li>
							<div><a href="assignment_1/index.html"><img data-original="img/acc_1.jpg" src="img/acc_1.jpg" alt="网页布局"></a></div>
							<div class="dt"><a href="assignment_1/index.html">作品1：普通网页布局</a></div>
						</li>
						<li>
							<div><a href="table_2/index.html"><img data-original="img/table_2.jpg" src="img/table_2.jpg" alt="表格练习缩略图"></a></div>
							<div class="dt"><a href="table_2/index.html">作品2：表格练习</a></div>
						</li>
						<li>
							<div><a href="loginForm/login.html"><img data-original="img/loginForm.png" src="img/loginForm.png" alt="登录界面缩略图"></a></div>
							<div class="dt"><a href="loginForm/login.html">作品3：表单制作登录界面</a></div>
						</li>
						<li>
							<div><a href="printing/printing.html"><img data-original="img/exp4.png" src="img/exp4.png" alt="图片4"></a></div>
							<div class="dt"><a href="printing/printing.html">作品4：打印图形</a></div>
						</li>
						<li>
							<div><a href="DOMExp/test05.html"><img data-original="img/DOM_Pic.png" src="img/DOM_Pic.png" alt="DOM编程缩略图"></a></div>
							<div class="dt"><a href="DOMExp/test05.html">作品5：DOM编程</a></div>
						</li>
						<li>
							<div><a href="eventExp/test06_event.html"><img data-original="img/eventPic.png" src="img/eventPic.png" alt="事件编程缩略图"></a></div>
							<div class="dt"><a href="eventExp/test06_event.html">作品6：事件编程</a></div>
						</li>
						<li>
							<div><a href="BOMExp/test07_BOM.html"><img data-original="img/BOM_Pic.png" src="img/BOM_Pic.png" alt="BOM编程缩略图"></a></div>
							<div class="dt"><a href="BOMExp/test07_BOM.html">作品7：BOM编程</a></div>
						</li>
						<li>
							<div><a href="jQueryDOM/test08_jQuery.html"><img data-original="img/jQuery_DOMPic.png" src="img/jQuery_DOMPic.png" alt="jQueryDOM缩略图"></a></div>
							<div class="dt"><a href="jQueryDOM/test08_jQuery.html">作品8：jQuery-DOM</a></div>
						</li>
						<li>
							<div><a href="ShoppingCart/shoppingCart.html"><img data-original="img/jQueryEventPic.png" src="img/jQueryEventPic.png" alt="jQuery事件缩略图"></a></div>
							<div class="dt"><a href="ShoppingCart/shoppingCart.html">作品9：jQuery-事件</a></div>
						</li>
						<li>
							<div><a href="jQueryAnimation/tab_task.html"><img data-original="img/jQueryAnimatePic.png" src="img/jQueryAnimatePic.png" alt="jQuery事件缩略图"></a></div>
							<div class="dt"><a href="jQueryAnimation/tab_task.html">作品10：jQuery-动画</a></div>
						</li>
						<li>
							<div><a href="ajaxWeb/ajax_task11.html"><img data-original="img/ajaxPic.png" src="img/ajaxPic.png" alt="jQuery事件缩略图"></a></div>
							<div class="dt"><a href="ajaxWeb/ajax_task11.html">作品10：Ajax应用</a></div>
						</li>
					</ul>

				</div>
			</div>
		</div>
		<div class="clear"></div>
		<div id="sideBar" class="infoItem">
			<h3 class="catListTitle">个人资料</h3>
			<div id="blog-news">
				<div align="center">
					<a href="#">
						<img class="tx" src="img/touxiang.jpg">
					</a>
				</div>
				<div id="profile_block">
					昵称：
					<a href="#">
						宋东亭
					</a>
					<br><br>
					年龄：
					<a href="#" title="时间：2019-07-16">
						20
					</a>
					<br><br>
					粉丝：
					<a href="#">
						520
					</a>
					<br><br>
					关注：
					<a href="#">
						1314
					</a>
				</div>
			</div>
		</div><!--end: sideBar 侧边栏容器 -->
		<div class="clear"></div>
	</div><!--end: main -->
	<div class="clear"></div>
	<div id="footer">
	</div><!--end: footer -->
</div><!--end: home 自定义的最大容器 -->

</body>
</html>